/**
 * roundFractional浮点运算精度解决函数
 *
 * @param x {Number} 浮点数
 * @param n {Number} 想要保留的位数
 * @returns {Number}
 */
function roundFractional(x,n){
  return Math.round(x * Math.pow(10, n)) / Math.pow(10, n);
}

/**
 * numDecimalPlaces 计算小数点位数
 * 
 * @param x {Number} 输入的数字
 * @returns {Number}
 */
function numDecimalPlaces(x){
  return x.toString().split('.')[1] ? x.toString().split(".")[1].length : 0;
}

/**
 * validate 表单校验
 *
 * @param input 输入的数字
 * @param output 输出的错误提示
 * @returns {Boolean} 
 */
function validate(input, output){
  // 数据不能为空
  if(input.val() === ''){
    output.html('该字段输入不能为空');
    return false;
  } else {
    output.html('')
  }

  // 数据类型不对，数据不能是字符串，而应该是数字
  let inputval = Number(input.val());

  if(isNaN(inputval)){
    output.html('该字段输入应该为数字');
    return false;
  }else {
    output.html('')
  }

  // 数据的取值范围错误，宽度和高度都应该大于零
  if(inputval < 0){
    output.html('该数值不能小于0');
    return false;
  } else {
    output.html('');
  }

  return true; 
}


$(()=>{
  //get dom elem
  let $width=$('#width'),
      $btncal = $('#calc'),
      $height = $('#height'),
      $perimeter = $('#perimeter'),
      $area = $('#area'),
      $widthval = $('#width-val'),
      $heightval = $('#height-val'),
      $form = $('#main');

  $width.keypress((e)=>{
    let key = e.key,//输入的内容
        val = e.target.value,//输入前值的数量
        pos = e.target.selectionStart;

    $forkMeGH.show("https://gitee.com/jiyujia/spa-demo")

  })

  //cale button click
  $btncal.click(()=>{
    //get value
    let w = Number($width.val());
    let h = Number($height.val());

    // validate height $$ width 
    let n1 = numDecimalPlaces(w),
        n2 = numDecimalPlaces(h);

    //validate
    if(validate($width, $widthval) && validate($height, $heightval)){
      //cale
      let p = roundFractional((w + h) * 2, n1 > n2 ? n1 : n2) ,
          a = roundFractional(w * h, n1 + n2);

      //output
      $perimeter.val(p);
      $area.val(a)
    }
  })
})
